<template>
	<view>
		<view class="broker">
			<view class="title">绩优经纪人</view>
			<view class="item-list">
				<view class="item">
					<view class="left">
						<image src="http://jiaoyukehu.oss-cn-beijing.aliyuncs.com/static/logo.png" mode="" class="logo"></image>
					</view>
					<view class="right">
						<text class="wechat">公司微信:cjc888aa</text>
						<text class="name">南澳嵘璟</text>
					</view>
				</view>
				<view class="item item-last">
					<text>查看更多经纪人</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
</script>

<style lang="scss" scoped>
	.broker{
		margin: mp-sizing(10) 0;
		display: flex;
		flex-flow: column;
		.title{
			font-size: mp-sizing(20);
			font-weight: 800;
			margin-bottom: mp-sizing(10);
		}
		.item-list{
			display: flex;
			flex-flow: row nowrap;
			overflow-x: scroll;
			.item{
				min-width: mp-sizing(200);
				height: mp-sizing(60);
				margin-right: mp-sizing(15);
				padding: mp-sizing(10);
				display: flex;
				flex-flow: row;
				background-color: $uni-bg-color-grey;
				.left{
					display: flex;
					flex-flow: column;
					justify-content: center;
					margin-right: mp-sizing(10);
					.logo{
						width: mp-sizing(40);
						height: mp-sizing(40);
						border-radius: mp-sizing(20);
					}
				}
				.right{
					display: flex;
					flex-flow: column;
					justify-content: space-around;
					.wechat{
						font-size: mp-sizing(16);
						font-weight: 600;
					}
					.name{
						font-size: mp-sizing(14);
						color: $uni-text-color-grey;
					}
				}
			}
			.item-last{
				display: flex;
				justify-content: center;
				align-items: center;
				text{
					font-size: mp-sizing(18);
				}
			}
		}
	}
</style>